<template>
  <view class="questionBank">
    <block v-for="(item, index) in list" :key="index">
      <view class="item common-bg-white" v-if="index == currIndex">
        <view class="serial-number">{{ `${currIndex + 1}/${list.length}` }}</view>
        <view class="topic-outline"> {{item.title}} </view>
        <view class="item-options" v-if=" currItem?.options">
          <block v-for="(childItem, childIdx) in currItem.options" :key="childIdx">
            <view
              :class="['option', childItem.isCheck && 'option-active']"
              @click="handleOption"
              :data-child-item="childItem"
              :data-child-idx="childIdx"
              :data-parent-item="item"
            >
              {{ childItem.title }}
            </view>
          </block>
        </view>
        <view class="divider"></view>
        <view class="footer">
          <view 
            class="btn btn-prev" 
            @click="handleTap" 
            data-type="prev"
            :style="{visibility: currIndex > 0 ? 'visible' : 'hidden'}"
          >
            上一题
          </view>
          <view 
            :class="['btn', 'btn-next', !hasOptionItemChecked && 'btn-next-disabled']" 
            @click="handleTap" 
            data-type="next"
            :data-item="item"
            v-if="!isLastTopic"
          >
            下一题
          </view>
          <view 
            :class="['btn', 'btn-next']" 
            @click="handleTap" 
            data-type="submit"
            v-else
          >
            提交
          </view>
        </view>
      </view>
    </block>
  </view>
</template>
<script src="./indexMod.js" />
<style src="./indexStyle.scss" lang="scss" scoped>
</style>